<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>index</title>

    <script type="text/javascript" src="/js/jquery-3.5.1.js"></script>

    <style>
        .textColor {
            background: yellow;
        }

        a:link {
            color: black;
            text-decoration: none;
        }

        a:visited {
            color: black;
            text-decoration: none;
        }
    </style>
</head>
<body>
<div align="center" style="width:717px;margin:auto">
    <h2>核酸检测系统</h2>
    <form method="post" action="/page" style="display: inline">
        <select name="hospitalId">
            <option value="0">--请选择--</option>
            <option th:each="hospital:${hospitals}" th:value="${hospital.getId()}"
                    th:text="${hospital.getName()}"></option>
        </select>

        <input type="submit" value="查询">

    </form>
    <form th:action="@{/add}" style="float: right">
        <input type="submit" value="添加"/>
    </form>

    <table border="1px">
        <tr style="background-color: #65ef65;">
            <th>被检测人</th>
            <th>被检测人手机号</th>
            <th>被检测人身份证号</th>
            <th>检测机构</th>
            <th>检测日期</th>
            <th>检查结果</th>
            <th>操作</th>
        </tr>

        <tr th:each="medical,status:${medicals}" th:class="${status.count%2==0}?'textColor':''">
            <td th:text="${medical.getAssay_user()}"></td>
            <td th:text="${medical.getPhone()}"></td>
            <td th:text="${medical.getCard_num()}"></td>
            <td th:text="${medical.getHospitalName()}"></td>
            <td th:text="${#dates.format(medical.getAssay_time(),'yyyy-MM-dd')}"></td>
            <td th:utext="${medical.getAssay_result()} == 0?'<span>检测中</span>':'<span style=\'color: red\'>确诊</span>'">
            </td>
            <td>
                <a class="queZheng" th:attr="id=${medical.getId()}" href="javascript:void(0)">确诊</a>
            </td>
        </tr>
    </table>
</div>
</body>

<script>

    $(function () {

        $(".queZheng").click(function () {
            var type = $(this).parent().prev().text();
            var id = $(this).attr("id");

            if (type == '确诊') {
                alert("该检测者已经确诊");
            } else {
                if (confirm("请确认该检测者是否确诊")) {
                    $.ajax({
                        url: "http://localhost:8080/quezhen/" + id,
                    })
                    alert("确诊成功");
                    window.location.href = "/page";
                }
            }
        })

        // $.ajax({
        //     type: "get",
        //     url: "http://localhost:8080/sel",
        //     success: function (result) {
        //
        //     }
        // })
    })
</script>
</html>